<!DOCTYPE html>
<html>
<head>
	<title></title>
	<style type="text/css">
	*{margin:0;padding:0;}
	.container{
		/*display: flex;
		justify-content: center;
		align-items: center;*/
		position: relative;
		width: 300px;
		height: 300px;
		border:5px solid #ccc;
	}
	.main{
		position: absolute;
		left:50%;
		top:50%;
		background: red;
		transform: translate(-50%,-50%);
	}
	</style>
</head>
<body>


<div class='container'>
	<div class='main'>main</div>
</div>


</body>
</html>